//显示和隐藏
$('.top-r_login').on({
    mouseout:function(){  
      $('.top-r_select').show() 
    },
   mouseleave:function(){
    $('.top-r_select').finish().hide() 
   } 
})
// 点击搜索改变边框
var searchBtn = document.querySelector('.search_btn')
searchBtn.onfocus = function (){
  searchBtn.style.borderColor = '#ff1268'
}
searchBtn.onblur = function(){
    searchBtn.style.borderColor = '#f8f8f8'
}

// 登录操作
if(getCookie('uname') === '' ){
    $('.top-r_login').click(function(){
        window.location.href = '../pages/login.html'
    })
}

var myname = getCookie('uname')
if( $('.top-r_login_lg').text() !== myname ){
$('.top-r_login_lg').text(`${myname}`)
$('.login_out').css('display','block')
 if( myname === ''){
    $('.top-r_login_lg').text('登录')
    $('.login_out').css('display','none') 
 }
}
$('.login_out').click(function(){
    $('.top-r_login_lg').text('登录')
    $('.login_out').css('display','none') 
    window.location.href = '../pages/index.html'
    setCookie('uname',1,-1)
})

// 判断是否登录,进去购物车
$('.top-r_sel_in').on('click','.cartbtn',function(){
    if( document.cookie === '' ){
        window.location.href = '../pages/login.html'
    }else{
        window.location.href = '../pages/carts.html'
    }
})

// 数据渲染
var arr = ['城 市：','分 类：','子 类：','时 间：']
var arr1 = ['今天','明天','本周末','一个月内','按日历']
var citys = 20
   //  准备一个变量, 记录分页器切换到多少页了
   let currPage = 1 // 默认是第一页
   let flag =true
   let orders = 1
//    let tsgs =0
    let list = []

   // 获取列表数据
getList()
function getList(){
    $.ajax({
        url:'/dm',
        data:{
          keyword:'',
          cty:'',
          ctl:'',
          sctl:'',
          tsg:0,
          st: '',
          et: '',
          order: orders,
          pageSize: 30,
          currPage: currPage, // 用的是全局变量
          tn: ''
        },dataType:'json',
        success:function(res){
        $('.list-cont_top_keywd').text(res.pageData.maxTotalResults)
        arr.forEach((item,index) => {  
            var str = ''    
             if(index === 0){
                $('.tit_01').text(item)         
             res.pageData.factMap.cityname.forEach((item,index) => {
                if(index <citys){
                     str +=`<span class="cont-content_item ">${item.name}</span>`
                 
                   
            }
        })
        $('.content_item_01').html(str)
     } else if( index ===1){
        $('.tit_02').text(item)  
                res.pageData.factMap.categoryname.forEach(item=>{
                    str +=`<span class="cont-content_item ">${item.name}</span>`
                })
                $('.content_item_02').html(str)
            }else if( index ===3){
                $('.tit_03').text(item)  
                $('.font-cont_min').addClass('timesac')       
                arr1.forEach(item=>{
                    str +=`<span class="cont-content_item ">${item}</span>`            
            })
            $('.content_item_03').html(str)
            }       
        })   
        // 执行渲染页面的时候传递进去的就是第几页的数据
        bindHtml(res.pageData.resultData) // 渲染页面

          // flag 是 true , 后面的就执行
          // flag 是 false, 后面的就不执行
        flag && bindPagi(res.pageData.totalPage)
        bindOrder()
        // bindTarg(res.ids)
        // bindTsg(res.pageData.resultData)
         // 把数组保存以下
         list = res.pageData.resultData
        } 
    })
}
 // 数据遍历list
function bindHtml(list){
    var str1  = ''
list.forEach(item=>{
        str1 +=`
        <li class="items clearfixer" data-id="${item.id}">
           <a href="javascript:;" class="items_img">
             <span class="items_tag">${item.categoryname}</span>
             <img src="${item.verticalPic}" alt="" class="">
           </a>
           <div class="items_txt">
                <div class="items_txt_tit">
                    <span class="">【${item.venuecity}】</span>
                    <a href="javascript:;">${item.nameNoHtml}</a>
                </div>
                <div class="items_txt_time">${item.description}</div>
                <div class="items_txt_time">
                   <a href="javascript:;" class="items_txt_icon1" ></a>
                   ${item.venuecity} | ${item.venue}
                </div>
                <div class="items_txt_time">
                 <a href="javascript:;" class="items_txt_icon2"></a>
                 ${item.showtime}
                </div>
                <div class="items_txt_tags">   
                </div>
                <div class="items_txt_price">
                    <span>${item.price_str}<i>元</i></span>售票中
                </div>
            </div>
        </li>                 
        `

    })
    $('.ulli').html(str1)
}

function bindPagi(totalPage){
    flag = false
    $('.pagi').pagination({
        pageCount: totalPage, // 总页数
        current: 1, // 当前页
        jump: false,
        coping: false,
        prevContent: '<',
        nextContent: '>',
        keepShowPN:true,
        callback: function (api) { // 当你切换页面的时候会触发
          // api.getCurrent() 获取当前是第几页
          // console.log(api.getCurrent())
          // 给全局准备的变量赋值
          // 你切换一次, 全局变量就改变一次
          currPage = api.getCurrent()
          
          // 每一次改变执行一次 getList
          getList()
        }
      })

}

 $('.list-content').on('click','.cont-more',function(e){
        e.preventDefault()
        citys =124
        getList() 
        $('.cont-more').css('display','none')
        $('.cont-sq').css('display','block')   
})
$('.list-content').on('click','.cont-sq',function(e){
    e.preventDefault()
    citys =20
    getList() 
    $('.cont-more').css('display','block')
    $('.cont-sq').css('display','none')   
})
$('.qhcs').on('click','span',function(){
     if( $(this).text() === '全部'){
    $('.fator-cont_sel_city').text('全国')
     }else{
        $('.fator-cont_sel_city').text( $(this).text())
     }
    
})
// 点击回到顶部
$(window).scroll(function(){
    // console.log()
    if($(window).scrollTop() >=240){
         $('.rtop').show()
    }else{
        $('.rtop').hide()
    }
})
$('.rtop').click(function(){
    // $(window).scrollTop()
  $('html').animate({
      scrollTop:0
  },300)
})
// 按功能排序
function bindOrder(){
   $('.search-sort_l').on('click','.search-sort_item',function(){
       $(this).addClass('search-sort_active').siblings().removeClass('search-sort_active')
       orders = $(this).index()
       getList()
   })

}

// 点击跳转详情页
$('.ulli').on('click','li',function(){
        const id = $(this).data('id')
        let data  = null
        for(let i = 0;i< list.length;i++){
            if(list[i].id === id){
                data =list[i]
                break
            }
        }
        localStorage.setItem('goodsInfo',JSON.stringify(data))
        window.location.href = '../pages/detail.html'
    })

